
<nav class="navbar navbar-expand-md  bg-light navbar-fixed-top">

    <!---放log的地方-->
    <a class="navbar-brand" href="#">Mactavish</a>
    <!------button为实现响应式布局，如果在手机上查看，点击button就可以弹出菜单---->
    <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#collapsibleNavbar">
        <span class="navbar-toggler-icon"></span>
    </button>
    <!-- 当浏览器小于某个值时，点击button图标显示导航条的内容（注意这里的id与button 的id对应）-->
    <div class="collapse navbar-collapse" id="collapsibleNavbar">
        <ul class="navbar-nav">
            <li class="nav-item">
                <!-- 把Go模板的active放在class里面才有效，在外面另外写一个class貌似没有用，不知道为什么 -->
                <a class="nav-link {{if .activeHome}} active {{end}}" href="#">HOME</a>
            </li>
            <li class="nav-item">
                <a class="nav-link {{if .activeTags}} active {{end}}" href="#">TAGS</a>
            </li>
            <li class="nav-item">
                <a class="nav-link {{if .activeAbout}} active {{end}}" href="#">ABOUT</a>
            </li>
        </ul>
        <!--导航栏右部，一般的登录 注册-->
        {{if .IsLogin}}
        <!-- 这是bootstrap 4,右对齐在元素上加ml-auto,左对齐是mr-auto，pull-right和navbar-right没有用 -->
        <ul class="navbar-nav ml-auto">
            <li class="nav-item"><a class="nav-link" href="/exit">退出</a></li>
        </ul>
        {{else}}
        <ul class="navbar-nav ml-auto">
            <li class="nav-item"><a class="nav-link" href="/login">登录</a></li>
            <li class="nav-item"><a class="nav-link" href="/register">注册</a></li>
        </ul>
        {{end}}
    </div>
</nav>
<!------------------------------------------导航条结束-------------------------------->